<%--
  Created by IntelliJ IDEA.
  User: linnanxiang
  Date: 2020/12/21
  Time: 10:42
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
    <title>气温随季节变化</title>
    <script src="js/jquery.min.js"></script>
    <script src="js/echarts.min.js"></script>

  </head>

  <body>
  <div id="main" style="width: 1400px;height:700px;"></div>
<script>
  $(document).ready(function (){

    myChart = echarts.init(document.getElementById('main'));

    option = {
      title: {
        text: '随季节变化气温变化',
        textStyle: {
          fontSize: 40,
          fontFamily:'华文行楷',
          fontWeight: '100',
          align: 'center',
          color: '#080b30',
        },
      },
      angleAxis: {
        type: 'category',
        data: []
      },
      radiusAxis: {
      },
      polar: {
      },
      series: [{
        type: 'bar',
        data: [],
        coordinateSystem: 'polar',
        name: '气温摄氏度',
        stack: 'a'
      }, {
        type: 'bar',
        data: [],
        coordinateSystem: 'polar',
        name: '体感温度',
        stack: 'a'
      }],
      legend: {
        show: true,
        data: ['气温摄氏度', '体感温度']
      }
    };

    var dates=[];
    var temp=[];
    var atemp=[];



    $.ajax({
      url: 'tempseason',
      method: "get",
      type: "json",
      success: function (data) {

       if (data){
           for (var i=0;i<data.length;i++){
               dates.push(data[i].season);
           }
           for (var i=0;i<data.length;i++){
             temp.push(data[i].temp);
             atemp.push(data[i].atemp);

           }
       }

        option.angleAxis.data=dates;

       option.series[0].data=temp;
        option.series[1].data=atemp;


        console.log(option)
        myChart.setOption(option);
      },
      error: function (errMsg) {
        console.error(errMsg)
      }
    });

  })


</script>


  </body>
</html>
